<nav class="w-full p-4" [ngClass]="['bg' + default, 'text' + defaultInv]" aria-label="breadcrumb">
	<ol class="flex h-8 space-x-2" [ngClass]="['text' + defaultInv]">
		<li class="flex items-center">
			<a
				rel="noopener noreferrer"
				href="#"
				class="flex items-center hover:underline"
				title="Back to homepage"
			>
				Home
			</a>
		</li>

		<li *ngFor="let num of [1, 2, 3]; let i = index" class="flex items-center space-x-1">
			<span [ngClass]="['text' + plainInv]">/</span>
			<a
				rel="noopener noreferrer"
				href="#"
				class="flex items-center px-1 capitalize hover:underline"
				[ngClass]="{'hover:no-underline cursor-default': i == 2}"
			>
				{{ i < 2 ? 'Parent' : 'Current' }}
			</a>
		</li>
	</ol>
</nav>
